Back Button DDC

Notice that clicking on the Back button here will not result in any action, because there is no previous URL in the history list.

copy the code in the Html section and Paste it to the <Body> tag.

Html


    <div class="main_grid">
      <div>
      <button onclick="goBack()">Go Back</button>
      
      <p>Notice that clicking on the Back button here will not result in any action, because there is no previous URL in the history list.</p>
      </div>
      


copy the code in the CSS section and Paste it to the \CSS\style.com file.

css

    :root {
      --text: hsl(9, 62%, 96%);
      --background: hsl(4, 68%, 5%);
      --primary: hsl(2, 65%, 72%);
      --secondary: hsl(3, 66%, 14%);
      --accent: hsl(2, 65%, 54%);
    }
  body{
      background-color: var(--background);
      color: var(--text);
      padding: 2rem;
      font-family: 'Times New Roman', Times, serif;
  }
  
  button{
      background-color: var(--primary);
      color: var(--secondary);
      padding: .25rem;
      border-radius: 10px ;
      border: .1rem solid;
      border-color: var(--text);
      font-weight: 400;
  }
    h1{
      font-size: 3rem;
  }
  
  


copy the code in the JS section and Paste it to just above the <body> tag.

JS


  
<script> function goBack() { window.history.back(); } </script>